.finding-card-wrapper {
  display: flex;
  align-items: center;
  height: 24px;
  padding-left: 22px;
  width: 100%;
  overflow: hidden;

  &:hover {
    background-color: $coconut;
  }

  &:active {
    background: rgba(0, 0, 0, 0.08);
  }
}

.finding-card {
  flex: 1;
  color: $aqua;
  user-select: none;
  transition: background 150ms;
  display: flex;
  align-items: center;
  overflow: hidden;

  .program {
    display: flex;
    align-items: center;
    margin-left: 6px;
    color: $aqua;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

    p {
      @include label-small;
      line-height: 16px;
      padding: 0 5px;
      display: inline-block;
      margin: 0;
      margin-right: 1px;
      overflow-x: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
  }

  p.pin {
    color: $white-1;
    background: $green;
    border-radius: 3px;
    flex-shrink: 0;
  }

  .warning-body {
    display: flex;
    align-items: center;

    svg {
      fill: $yellow;
      height: 11px;
      width: 11px;
      margin-right: 12px;
      margin-bottom: 3px;
    }
  }
}
